<!DOCTYPE html>
<html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Document</title>
            <style>
                *{
                    margin: 0px;
                    padding: 0px;
                    list-style: none;
                }
                .head{
                    height: 38px;
                    background: white;
                }
                .head .div{
                    height: 38px;
                    width: 456px;
                    background: red;
                }
                .head li{
                    float: right;
                    font-size: 15px;
                    margin: 29px 20px 0px 10px  ; 
                }
                .head b{
                    height: 25px;
                    width: 60px;
                    background: #4e6ef2;
                    border-radius: 5px ;
                    float: right;
                    font-size: 15px;
                    text-align: center;
                    margin: 29px 20px 0px 10px  ;
                    color: white;
                }
                .nav{
                    height: 215px;
                    width: 700px;
                    margin: 50px auto 0px;
                }
                .nav input{
                    height: 35px;
                    width: 540px;
                    border-radius: 10px 10px 10px 10px;
                    }
                
                .nav span{
                    position: absolute;
                    width: 19px;
                    height: 16px;
                    background: url('images/sxt.png') no-repeat 0px 0px;
                    margin: 10px 0px 0px -133px;
                    }    
                .nav button{
                    height: 39px;
                    width: 100px;
                    border:none;
                }
                p{
                    text-align: center;
                    
                }
                p img{
                    margin: 106px 354px -28px 221px;;
                }       
                .foot p{        
                    margin-top: 20px;
                    margin-right: 80px;
                }           
            </style>
        </head>
        <body>
            <div class="head">
                <ul>
                    <b>更多产品</b>
                    <li>设置</li>
                    <li>登录</li>
                    <li>贴吧</li>
                    <li>视频</li>
                    <li>地图</li>
                    <li>hao123</li>
                    <li>新闻</li>
                    <li>糯米</li>
                </ul>
            </div>
            <div class="nav">
                <div>
                    <img src="images/bd_logo1.png"  alt="">
                </div>
                <input type="text">
                <button>
                    百度一下
                </button>
                <span></span> 
            </div>
            <div class="con">
                <p>
                    <img src="images/zbios_efde696.png" alt=""><br>
                    <span>手机百度</span>
                </p>
            </div>
            <div class="foot">
                <p> 
                    <a href="">把百度设为主页</a><a href="">关于百度</a> About  Baidu百度推广<i class="foot"></i>
                </p>
                <p>
                    ?2016 Baidu 使用百度前必读 意见反馈 京ICP证030173号  京公网安备11000002000001号<i class="police"></i> 
                </p>
            </div>
        </body>
</html>